package myJs

import myJs.admin.AdminCp
import myJs.admin.companyMemeberManage.CompanyMemberManage
import myJs.admin.memberManage.MemberManage
import myJs.admin.specialMemberManage.SpecialMemberManage
import myJs.admin.wechatMemberManage.WechatMemberManage
import myJs.member.MemberCp
import myJs.myPkg.{CSSTransition, TransitionGroup, _}
import slinky.core._
import slinky.core.annotations.react
import slinky.web.html._

import scala.scalajs.js
import scala.scalajs.js.annotation.JSImport

@JSImport("resources/logo.svg", JSImport.Default)
@js.native
object ReactLogo extends js.Object

@react object App {
  type Props = Unit

  val component = FunctionalComponent[Props] { props =>

    val location = ReactRouterDOM.useLocation()

    div(className := "App")(
      Routes(
        Route(path = "", element = LoginCp()),
        Route(path = "admin", element = AdminCp())(
          AdminCp.pages.map { x =>
            val finalCp = TransitionGroup(
              CSSTransition(key = x.path, classNames = "fade", timeout = 300, location = location)(
                x.cpE
              )
            )
            Route(key = x.path, path = x.path, element = finalCp)
          }
        ),
        Route(path = "member", element = MemberCp())(
          MemberCp.pages.map { x =>
            val finalCp = TransitionGroup(
              CSSTransition(key = x.path, classNames = "fade", timeout = 300, location = location)(
                x.cpE
              )
            )
            Route(key = x.path, path = x.path, element = finalCp)
          }
        )

      ),

    )

  }


}
